<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/2002/REC-xhtml1-20020801/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="nb-NO">
  <head>
    <title>Test suite for Validatious 2.0 HTML declarative validation</title>
    <?php
        require '../utils/core.php';
        print scripts(array('extensions/html'));
    ?>
    <script type="text/javascript">
// Opera needs this
function test() {
    assert(true);
}

function testValidatorExtension() {
    assertNotUndefined(v2.Validator.prefix);
    assertEquals('', v2.Validator.prefix);
}

function testFormExtension() {
    assertEquals('validate', v2.Form.autoValidateClass);
    assertEquals('action', v2.Form.actionButtonClass);
}

function testValidatorsFromStringNoPrefixSimpleValidator() {
    var validator = v2.$v('required');
    var result = v2.html.validatorsFromString('required');

    assertEquals(1, result.length);
    assertEquals(validator, result[0].validator);
    assertEquals(0, result[0].params.length);
    assertEquals(false, result[0].invert);
}

function testValidatorsFromStringNoPrefixValidatorWithParams() {
    var validator = v2.$v('min-length');
    var result = v2.html.validatorsFromString('min-length_4');

    assertEquals(1, result.length);
    assertEquals(validator, result[0].validator);
    assertEquals(1, result[0].params.length);
    assertEquals("4", result[0].params[0]);
    assertEquals(false, result[0].invert);
}

function testValidatorsFromStringNoPrefixValidatorMistyped() {
    var result = v2.html.validatorsFromString('min_length');

    assertEquals(0, result.length);
}

function testValidatorsFromStringNoPrefixValidatorAlias() {
    var validator = v2.$v('required');
    var result = v2.html.validatorsFromString('not-empty');

    assertEquals(1, result.length);
    assertEquals(validator, result[0].validator);
    assertEquals(0, result[0].params.length);
    assertEquals(false, result[0].invert);
}

function testValidatorsFromStringNoPrefixValidatorInverted() {
    var validator = v2.$v('email');
    var result = v2.html.validatorsFromString('not_email');

    assertEquals(1, result.length);
    assertEquals(validator, result[0].validator);
    assertEquals(0, result[0].params.length);
    assertEquals(true, result[0].invert);
}

function testValidatorsFromStringNoPrefixSeveralValidators() {
    var required = v2.$v('required');
    var minLength = v2.$v('min-length');
    var email = v2.$v('email');
    var result = v2.html.validatorsFromString('required bogus min-length_4 not_email text');

    assertEquals(3, result.length);
    assertEquals(required, result[0].validator);
    assertEquals(minLength, result[1].validator);
    assertEquals(email, result[2].validator);
    assertEquals(0, result[0].params.length);
    assertEquals("4", result[1].params.join());
    assertEquals(0, result[2].params.length);
    assertEquals(false, result[0].invert);
    assertEquals(false, result[1].invert);
    assertEquals(true, result[2].invert);
}

function testValidatorsFromStringPrefix() {
    var validator = v2.$v('required');
    assertEquals(0, v2.html.validatorsFromString('v2_required').length);

    v2.Validator.prefix = 'v2';
    assertEquals(0, v2.html.validatorsFromString('v2_required').length);

    v2.Validator.prefix = 'v2_';
    assertEquals(validator, v2.html.validatorsFromString('v2_required')[0].validator);
    assertEquals(validator, v2.html.validatorsFromString('v2_not_required')[0].validator);
    assertEquals(0, v2.html.validatorsFromString('required').length);

    v2.Validator.prefix = '';
}

function testApplyValidators() {
    var validators = v2.html.validatorsFromString('required min-length_4');
    var field = new v2.Field('field1');
    assertUndefined(field.get(0));

    v2.html.applyValidators(validators, field);
    assertEquals(2, field.get().length);

    assertEquals(v2.$v('required'), field.get(0).__validator);
    assertEquals(v2.$v('min-length'), field.get(1).__validator);
    assertEquals('4', field.get(1).__params.join());

    field = new v2.Field('field2');
    v2.html.applyValidators(validators, field, v2.$('field2').title);
    field.validate();
    assertEquals('This field should be atleast 12 characters!', field.getMessages().join());
}

function __testFormConstructor() {
    var form = v2.$('test2');
    var validation = new v2.html.Form(form);
    assertTrue(validation.form.passOnAny());

    v2.$('next2').click();
    v2.wait(500);
    assertTrue(v2.$(v2.$('field5').parent).hasClassName('error'));

    var value = v2.$('field5').value;
    v2.$('field5').value = 'This is a really really long value';
    assertTrue(validation.form.validate());
    assertFalse(v2.$(v2.$('field5').parent).hasClassName('error'));

    v2.$('field5').value = value;
}

function testParseElementInputElementNoClassName() {
    var form = v2.$('test2');
    var validation = cleanForm(form);
    var collection = new v2.CompositeFormItem();

    validation.parseElement(v2.$('f6'), collection);
    assertEquals(0, collection.get().length);
}

function testParseElementInputElementClassName() {
    var form = v2.$('test2');
    var validation = cleanForm(form);
    var collection = new v2.CompositeFormItem();

    validation.parseElement(v2.$('f5'), collection);
    assertEquals(1, collection.get().length);
}

function testParseElementInputElementInsignificantClassName() {
    var form = v2.$('test2');
    var validation = cleanForm(form);
    var collection = new v2.CompositeFormItem();

    validation.parseElement(v2.$('f7'), collection);
    assertEquals(0, collection.get().length);
}

function testParseElementButton() {
    var form = v2.$('test2');
    var validation = cleanForm(form);
    var collection = new v2.CompositeFormItem();

    assertEquals(0, validation.form.__buttons.length);
    validation.parseElement(v2.$('buttons'), collection);
    assertEquals(1, validation.form.__buttons.length);
}

function testParseBlockNoClassName() {
    var form = v2.$('test2');
    var validation = cleanForm(form);
    var collection = new v2.CompositeFormItem();

    validation.parseBlock(v2.$('fs1'), collection)
    assertEquals(0, collection.get().length);
}

function testParseBlockAnyClass() {
    var form = v2.$('test2');
    var validation = cleanForm(form);
    var collection = new v2.CompositeFormItem();
    var fieldset = v2.$('fs2');
    fieldset.className = 'validate_any';

    validation.parseBlock(fieldset, collection)
    assertEquals(1, collection.get().length);
    assertEquals(1, collection.get(0).get().length);
    assertTrue(collection.get(0).passOnAny());
}

function testParseBlockAllClass() {
    var form = v2.$('test2');
    var validation = cleanForm(form);
    var collection = new v2.CompositeFormItem();
    var fieldset = v2.$('fs2');
    fieldset.className = 'validate_all';

    validation.parseBlock(fieldset, collection)
    assertEquals(1, collection.get().length);
    assertEquals(1, collection.get(0).get().length);
    assertFalse(collection.get(0).passOnAny());
}

function testParseBlockGlobalValidator() {
    var form = v2.$('test2');
    var validation = cleanForm(form);
    var collection = new v2.CompositeFormItem();
    var fieldset = v2.$('fs2');
    fieldset.className = 'validate_all required';

    validation.parseBlock(fieldset, collection)
    assertEquals(1, collection.get().length);
    assertEquals(3, collection.get(0).get().length);
    assertFalse(collection.get(0).passOnAny());
    assertEquals(2, collection.get(0).get(0).get().length);
    assertFalse(collection.validate());

    v2.$('field9').value = 'Something';
    assertFalse(collection.validate());

    v2.$('field10').value = 'Something';
    assertFalse(collection.validate());

    v2.$('field8').value = 'something@somewhere.com';
    assertTrue(collection.validate());

    v2.$('field8').value = 'Text';
    v2.$('field9').value = '';
    v2.$('field10').value = '';
}

// Helpers

function cleanForm(form) {
    var validation = new v2.html.Form(form);
    validation.__parsed = {}; // Reset internal state
    validation.form = new v2.Form(form); // Create blank form object

    return validation;
}

function testAutoDiscovery() {
    var form = v2.Form.get('testForm');
    assertFalse(form.test());

    v2.$('next').click();
    v2.wait(500);
    assertTrue(v2.$(v2.$('field2').parentNode).hasClassName('error'));
}
    </script>
    <style>
      .field {
          padding: 12px;
      }

      .error {
          border: 1px solid #c00;
      }

      .error .messages {
          color: #c00;
      }
    </style>
  </head>
  <body>
    <form id="testForm" class="validate">
      <fieldset>
        <div class="field">
          <label for="field1">Field 1</label>
          <input type="text" name="field1" id="field1" value="Text" class="min-length_4" />
        </div>
        <div class="field">
          <label for="field2">Field 2</label>
          <input type="text" name="field2" id="field2" value="Text" title="This field should be atleast 12 characters!" class
="min-length_12" />
        </div>
        <div class="field">
          <label for="field3">Field 3</label>
          <input type="text" name="field3" id="field3" value="Text" class="not_min-length_4" />
        </div>
        <div class="field">
          <label for="field4" title="E-mail">Enter your email</label>
          <input type="text" name="field4" id="field4" value="Text" class="required email" />
        </div>
      </fieldset>
      <fieldset>
        <div class="button"><input type="submit" name="next" value="Next" id="next" /></div>
        <div class="button"><input type="submit" name="prev" value="Previous" id="prev" /></div>
      </fieldset>
    </form>
    <form id="test2" class="validate_any">
      <fieldset id="fs1">
        <div class="field" id="f5">
          <label for="field5">Field 5</label>
          <input type="text" name="field5" id="field5" class="min-length_15" value="Text" />
        </div>
        <div class="field" id="f6">
          <label for="field6">Field 6</label>
          <input type="text" name="field6" id="field6" value="Text" />
        </div>
        <div class="field" id="f7">
          <label for="field7">Field 7</label>
          <input type="text" name="field7" id="field7" class="bogus" value="Text" />
        </div>
      </fieldset>
      <fieldset id="fs2">
        <div class="field">
          <label for="field8">Field 8</label>
          <input type="text" name="field8" id="field8" value="Text" class="email" />
        </div>
        <div class="field">
          <label for="field9">Field 9</label>
          <input type="text" name="field9" id="field9" value="" />
        </div>
        <div class="field">
          <label for="field10">Field 10</label>
          <input type="text" name="field10" id="field10" value="" />
        </div>
      </fieldset>
      <fieldset id="buttons">
        <div class="button"><input type="submit" name="next" value="Next" id="next2" class="action" /></div>
        <div class="button"><input type="submit" name="prev" value="Previous" id="prev2" /></div>
      </fieldset>
    </form>
  </body>
</html>
